<template>
    <app-wrapper class="login-wrap" :show-login-protocol="true" :inner-login="false" @login-success="loginSuccessHandle">
        <img class="bg" mode="aspectFill" src="../static/images/login-bg.png" alt=""/>
        <img src="../static/images/logo.png" mode="aspectFill" alt="" class="logo">
        <van-button class="login-btn" :loading="loading" round block @click="$appWrap.showProtocol()">
            <img class="icon-wechat" mode="widthFix" src="../static/images/icon-wechat.png"/>
            微信一键登录
        </van-button>
    </app-wrapper>
</template>

<config>
    {
    navigationBarTitleText: '登录',
    navigationBarTextStyle: 'white',
    navigationBarBackgroundColor: '#476888',
    }
</config>

<script>
  import AppWrapper from "@/components/app-wrap";

  export default {
    name: "login",
    components: {AppWrapper},
    data() {
      return {
        loading: false
      }
    },
    computed: {
      from() {
        return decodeURIComponent(this.$mp.query.from)
      }
    },
    methods: {
      loginSuccessHandle(){

      }
    },
    mounted() {

    }
  }
</script>

<style lang="less">
    .login-wrap {
        width: 100vw;
        height: 100vh;
        position: relative;
        background-color: #476888;
        overflow: hidden;

        .bg {
            position: absolute;
            width: 100vw;
            height: 100vh;
            left: 0;
            top: 0;
        }

        .logo {
            margin: 150px auto 183px auto;
            position: relative;
            display: block;
            width: image-width("../static/images/logo.png");
            height: image-height("../static/images/logo.png");
        }

        .login-btn {
            .van-button {
                color: rgba(0, 47, 95, 1);
                display: block;
                width: 678px;
                height: 96px;
                line-height: 94px;
                background: rgba(255, 255, 255, 1);
                opacity: 1;
                border-radius: 60px;
                margin: auto;
                font-size: 32px;
                font-weight: 400;
            }

            .icon-wechat {
                width: 44px;
                transform: translateY(.2em);
            }
        }
    }
</style>
